<!-- 自我评价 -->
<template>
    <div class="selfCheck">
        <h4>{{ this.zhuguan == true ? this.homework.user.userid : '我' }}的作业</h4>
        <p>
            {{ homework.user.workName }}
            <a v-if="!zhuguan" class="upload">
                {{ homework.user.workName == '待提交' ? '提交作业' : '再次提交' }}
                <input type="file" id="selfHomeworkFile" @change="changeFilename($event)" >
            </a>
            <a class="submit" v-if="uploadOpen" @click="upload()" style="margin-left:1em;">提交</a>

            <a v-if="zhuguan" class="upload" :href="homework.user.workLink">下载</a>
        </p>

        <div class="score-div clearfix">
            <ul class="clearfix score-ul">
                <li></li>
                <li></li>
                <li></li>
                <li></li>
                <li></li>
                <li></li>
                <li></li>
                <li></li>
                <li></li>
                <li></li>
            </ul>
            <div class="score">
                <input
                    v-if="!zhuguan"
                    :class="{'smallFont': homework.user.selfCheck == '待评分'}"
                    type="text"
                    v-model="homework.user.selfCheck"
                    @keyup="fillScore(homework.user.selfCheck)">

                <p
                    v-if="zhuguan"
                    :class="{'smallFont': homework.user.selfCheck == '待评分'}">{{ homework.user.selfCheck }}
                </p>
            </div>
            <a v-if="update" class="submit" @click="updateself()">提交评分</a>
        </div>

    </div>

</template>

<script>
    export default {
        data(){
            return {
                update:false,
                uploadOpen: false,
            }
        },
        props:['homework', 'zhuguan'],
        methods:{
            fillScore(score) {
                this.update = true;
                var el = document.getElementsByClassName('selfCheck')[0];
                var scoreDiv = el.getElementsByClassName("score-div")[0];
                var li = scoreDiv.getElementsByTagName("li");
                if (Math.round(score) > 10 || Math.round(score) < 0) {
                    alert('评分范围：0 - 10');
                }else{
                    var roundScore = Math.round(score);
                    for (var i = 0; i < li.length; i++) {
                        li[i].style['background-color'] = '#d5d6d7';
                    }
                    for (var i = 1; i <= roundScore; i++) {
                        li[i-1].style['background-color'] = 'rgba(51, 153, 255,'+ i/10 + ')';
                    }
                }
            },
            updateself(){
                var selfCheck = {
                    homeworkName: this.homework.homeworkName,
                    selfCheck: this.homework.user.selfCheck
                };
                this.$http.post('/admin/work/updateself', selfCheck).then(function (d) {
                    if (d.data === 'success') {
                        alert('评分成功')
                    }else if (d.data === 'fail') {
                        alert('评分失败')
                    }
                }, function (err) {
                    alert('评分失败：', err.status);
                })
            },
            upload(){
                var file = document.getElementById('selfHomeworkFile').files[0];
                if (file == undefined) {
                    alert('文件不能为空！');
                }else {
                    var homeworkName = this.homework.homeworkName;
                    var workLink = this.homework.user.workLink;
                    var formData = new FormData();

                    formData.append('selfHomeworkFile', file);
                    formData.append('homeworkName', homeworkName);
                    formData.append('workLink', workLink);

                    this.$http.post('/admin/work/homeworkFile', formData).then(function (res) {
                        alert(res.data);
                    }, function (err) {
                        alert('err', err)
                    });
                }

            },
            changeFilename($event){
                this.uploadOpen = true;
                this.homework.user.workName = $event.target.files[0].name;
            },
        }
    }
</script>
